<%@page import="com.fasterxml.jackson.annotation.JsonInclude.Include"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags"%>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta content="telephone=no,email=no" name="format-detection">
    <script type="text/javascript" src="${ctx}/js/lib.js"></script>
    <script type="text/javascript" src="${ctx}/js/jquery.SuperSlide.js"></script>
    <script type="text/javascript" src="${ctx}/js/jquery.scrollLoading.js"></script>
    
    <script type="text/javascript" src="${ctx}/res/js/modules.js"></script>
    <link rel="stylesheet" href="${ctx }/res/hplus/js/plugins/layer/skin/layer.css">
	<script src="${ctx }/res/hplus/js/plugins/layer/layer.min.js"></script>
	<script type="text/javascript" charset="utf-8">
      $(function() {
          $("img.scrollLoading").lazyload({effect: "fadeIn",threshold :300});  
          $(".scrollLoading1 img").lazyload({effect: "fadeIn"});
      });
       $(document).ready(function(){
       	 setNav(2);
       });
    </script>
    <title>软装到家</title>
    <style type="text/css">
    	.layui-layer-content{color:black}
    	select,input{font-family:Microsoft YaHei}
		.text{ width:480px; height:38px;border:#ccc solid 1px; padding:0 2%; margin:0 0 20px 0; color:#888; font-size:14px;}
		.button{ width:100%; background:#ed145b; border:none; overflow:hidden; cursor:pointer; font-size:18px; color:#fff; text-align:center; height:40px; line-height:40px; margin:20px 0 0px;}
		.select{ width:160px;border:#ccc solid 1px; height:40px; margin:0px 0; float:left; font-size:14px; margin-right:10px}
		.select1{ width:160px;border:#ccc solid 1px; height:40px; margin:0px 0; float:left; font-size:14px;}
    </style>
</head>
<body>
 <%@include file="../common_head.jsp" %>
 <%@include file="../common_nav.jsp" %>
<!--banner-->
<div class="ogmall_designer_show">
    <div class="banner">
    	<div class="w">
            <div class="user_img"><img src="${designer.user.headImage }"></div>
            <h1>${designer.user.realName }</h1>
            <p>擅长风格：${designer.goodAtStyles }</p>
            <a href="#" class="user_btn" onclick="orderDesigner(${designerId});">预约设计</a>
            <div class="info">${designer.province.name }  ${designer.city.name }  从业${designer.workAge }年  ${designer.company }设计师</div>
    	</div>
    </div>
    <div class="w-1200 margin-0-auto">
    	<div class="title">作品</div>
    	<div class="works">
        <ul>
        	<c:forEach items="${designs }" var="ds">
        		<li>
        		<a href="${ctx }/design/detailNew?id=${ds.id}" target="_blank"  title="${ds.title }">
	                <div class="img"><img class="scrollLoading" data-original="${ds.headImage }" src="${ds.headImage }" style="display: inline;"></div>
		               <div class="b">
	                    <span>${ds.title }</span><em>${ds.houseType.name }&nbsp;&nbsp;${ds.houseStyle.name }</em>
                	   </div>
                </a>
            	</li>
        	</c:forEach>
        </ul>
        </div>
        <!--page-->
        	
        <!--page END-->
    </div>
</div>
<!--banner END-->
<div id="designOrder_div" style="display: none">
<div id="order_div">
	<form>
		<input type="hidden" name="designerId" value="${designerId }" />
		<input type="text" value="姓名" name="name" onfocus="if(value=='姓名') {value=''}" onblur="if (value=='') {value='姓名'}" class="text" id="name">
		<input type="text" value="手机号" name="mobile" onfocus="if(value=='手机号') {value=''}" onblur="if (value=='') {value='手机号'}" class="text" id="moblie">
		<select name="provinceId" id="provinceId" class="select provinceId" onchange="changeCity()">
		 	<option value="">省份</option>
             <c:forEach items="${provinces }" var="p">
             <option value="${p.id }">${p.name }</option>
             </c:forEach>
		</select>
		<select name="cityId" id="cityId" class="select cityId" onchange="changeCommunity()">
		 	<option value="">城市</option>
		</select>
		<select name="communityId" id="communityId" class="select1 communityId">
			<option value="">楼盘</option>
		</select>
		<input name="" type="button" class="button" onclick="return doOrder(this);" value="一键预约" id="btn">
	</form>
</div>
</div>
<div class="blank10"></div><div class="blank10"></div><div class="blank10"></div><div class="blank10"></div>
 <%@include file="../page4designerDetail.jsp"%>
 <%@include file="../foot.jsp" %>
<script type="text/javascript" src="${ctx}/js/plugins.js"></script>
<script type="text/javascript" src="${ctx}/js/modules.js"></script>
<script type="text/javascript" src="${ctx}/js/common.js"></script>
<script type="text/javascript">
function changeCity(){
	 $('.provinceId').each(function(){
	 	var provinceId=$(this).val();
	 	$.ajax({
    		url: "${ctx}/province/findArea",
    		data: {
    			provinceId: provinceId
    		},
    		dataType: "json",
    		success: function(data) {
    			 $('.cityId').each(function(){
		    			$(this).html('');
		    			$(this).append('<option value="">城市</option>');
						for (var i = 0; i < data.length; i++) {
							var obj = data[i];
							var option = '<option value="' + obj.id + '">' + obj.name + '</option>';
							$(this).append(option);	
						}
    			 });
    		}
    		
    	});
	 });		
}

function changeCommunity(){
	$('.cityId').each(function(){
	 	var cityId=$(this).val();
	 	if(cityId!=null&&cityId!=""){
	 		$.ajax({
    		url: "${ctx}/design/findCommunityByCity",
    		data: {
    			cityId: cityId
    		},
    		dataType: "json",
    		success: function(data) {
    			 $('.communityId').each(function(){
		    			$(this).html('');
		    			$(this).append('<option value="">楼盘</option>');
						for (var i = 0; i < data.length; i++) {
							var obj = data[i];
							var option = '<option value="' + obj.id + '">' + obj.name + '</option>';
							$(this).append(option);	
						}
    			 });
    		}
    		
    	});
	 	}
	 });		
}
	function gotoPage(pageNum,designerId) {   //跳转到指定页面
		location='${ctx}/design/indexNew?page='+pageNum+'&designerId='+designerId;
	}
    
</script>
</body>
</html>